<style lang="scss" scoped>
  @import "../../utils/base.scss";

  .wait {
    display: block;
    width: 26px;
    height: 26px;
    line-height: 24px;
    text-align: center;
    border: 1px solid #ccc;
    border-radius: 50%;
    font-size: 14px;
    transition: background-color 0.2s ease-in-out;
    border-color: #2d8cf0;
    background-color: #2d8cf0;
  }

  .wait1 {
    display: block;
    width: 26px;
    height: 26px;
    line-height: 24px;
    text-align: center;
    border: 1px solid #ccc;
    border-radius: 50%;
    font-size: 14px;
    transition: background-color 0.2s ease-in-out;
    border-color: #2d8cf0;
    background-color: white;
  }

  .ivu-steps-item.ivu-steps-custom .ivu-steps-head-inner>.ivu-steps-icon {
    top: 0px;
  }

  .myButton {
    display: inline-block;
  }
</style>

<template>
  <div>
    <div ref='base' class="quest_content" id="apply_sys">
      <template id="baseInfo">
        <div class="qheader"
          :style="{borderBottom: ifedit ? '0px solid rgb(210,210,210)' : '1px solid rgb(210,210,210)',}">
          <p>基本信息</p>
        </div>
        <div class="gcontent">
          <Form ref="baseInfo1" :id="baseId" :rules="baseInfoValidate" :model="applyinfo" :label-width="labelWidth"
            label-position="left" class="form form_left">
            <Row v-if="reqId != null && reqId != ''">
              <Col span="8">
              <FormItem label="工单ID：">
                <!--  <span>{{reqId}}</span> -->
                <Input :value="reqId" v-model="reqId" :readonly="readonly" />
              </FormItem>
              </Col>
            </Row>
            <Row>
              <Col span="8">
              <FormItem label="申请人：">
                <Input v-model="applyinfo.people[0].exAccount" :readonly="readonly" />
              </FormItem>
              </Col>
              <Col span="8" class="col_left">
              <FormItem label="申请人联系电话：">
                <Input v-model="applyinfo.people[0].fourA" :readonly="readonly" />
              </FormItem>
              </Col>
            </Row>
            <Row>
              <Col span="8">
              <FormItem label="申请人邮箱：">
                <Input v-model="applyinfo.people[0].mail" :readonly="readonly" />
              </FormItem>
              </Col>
              <Col span="8" class="col_left">
              <FormItem label="申请人部门：">
                <Input v-model="applyinfo.people[0].department" :readonly="readonly" />
              </FormItem>
              </Col>
            </Row>

            <Row>
              <Col span="8">
              <FormItem label="工单标题：" prop="duty">
                <Input v-model="applyinfo.people[0].duty" placeholder="XX租户+申请+XX系统主机最高权限" :readonly="ifedit" />
              </FormItem>
              </Col>
            </Row>

            <!-- 						<template v-for="(item, index) in applyinfo.people">
							<Row>
								<Col span="12">
								<FormItem label="使用人:" prop="peopleName">
									<template>
										<Input v-if="ifedit" style="width: 82%" v-model="applyinfo.people[index].peopleName" :readonly="readonly" />
										<component class="myButton" style="width: 82%" v-show="!ifedit" ref="inputSearch" :dataList="userList"  :checkLable="applyinfo.people[index].peopleUserId"
										 :is="'inputSearch'"  :multiple="false" @on-change="checkUser2($event,index)"></component>
									</template>
									<template v-if="!ifedit">
									 	<Button v-if="index === 0" class="myButton" style="margin-left: 2%" @click="addPeople()"><Icon type="ios-add"/></Button>
									 	<Button v-else class="myButton" style="margin-left: 2%" @click="deletePeople(index)"><Icon type="ios-remove"/></Button>
									</template>
								</FormItem>
								</Col>
							</Row>
							<Row>
								<Col span="8">
								<FormItem label="使用人联系电话：" prop="Phone">
									<Input v-model="applyinfo.people[index].phone" :readonly="ifedit" />
								</FormItem>
								</Col>
								<Col span="8" class="col_left">
								<FormItem label="借用单位：" prop="outterCompany">
									<Input v-if="editDept" v-model="applyinfo.people[index].outterCompany" :readonly="ifedit" />
									<template v-else>
										<Input v-if="ifedit" v-model="applyinfo.people[index].outterCompany" :readonly="true" />
										<Select v-else v-model="applyinfo.people[index].outterCompany" :disabled="ifedit">
											<Option v-for="item in applyinfo.people[index].deptList" :value="item.gName" :key="item.gName">{{item.gName}}</Option>
										</Select>
									</template>
								</FormItem>
								</Col>
							</Row>
						</template> -->

            <Row>
              <Col span="8">
              <FormItem label="所属租户：" prop="roleId">
                <Input v-if="ifedit" v-model="applyinfo.people[0].tenantName" :readonly="readonly" />
                <Select v-else v-model="applyinfo.roleId" @on-change="checkRole(applyinfo.roleId)" filterable
                  :disabled="ifedit" filterable :transfer="true">
                  <Option v-for="item in roleList" :value="item.id" :key="item.id">{{item.tenant_name}}</Option>
                </Select>
              </FormItem>
              </Col>
              <Col span="8" class="col_left">
              <FormItem label="所属项目：" prop="projectId">
                <Input v-if="ifedit" v-model="applyinfo.people[0].igroup" :readonly="readonly" />
                <Select v-else v-model="applyinfo.projectId" @on-change="checkProject" :disabled="ifedit" filterable
                  :transfer="true">
                  <Option v-for="item in projectList" :value="item.id" :key="item.id">{{item.project}}</Option>
                </Select>
              </FormItem>
              </Col>
            </Row>
            <Row>
              <Col span="8">
              <FormItem label="项目进度：" prop="des">
                <Input v-if="ifedit" v-model="applyinfo.people[0].elseAuthes[0].des" :readonly="readonly" />
                <Select v-else v-model="applyinfo.people[0].elseAuthes[0].des" :transfer='true' style="z-index:999"
                  :disabled="ifedit">
                  <Option value="工程建设期">工程建设期</Option>
                  <Option value="已上线">已上线</Option>
                  <!-- 									<Option value="系统升级、变更">系统升级、变更</Option> -->
                </Select>
              </FormItem>
              </Col>
            </Row>
          </Form>
        </div>
      </template>
      <template id="userInfo">
        <div class="qheader"
          :style="{borderBottom: ifedit ? '0px solid rgb(210,210,210)' : '1px solid rgb(210,210,210)',}">
          <p>使用人信息</p>
        </div>
        <div class="gcontent">
          <Form :id="userInfoId" ref="userInfo" :rules="userInfoValidate" :model="applyinfo" :label-width="labelWidth"
            label-position="left" class="form form_left">
            <template v-for="(item, index) in applyinfo.people">
              <Row>
                <Col span="12">
                <FormItem label="使用人:" prop="userInfo">
                  <template>
                    <Input v-if="ifedit" style="width: 82%" v-model="applyinfo.people[index].peopleName"
                      :readonly="readonly" />
                    <component class="myButton" style="width: 82%" v-show="!ifedit" ref="inputSearch"
                      :dataList="userList"  :checkLable="applyinfo.people[index].peopleUserId" :is="'inputSearch'"
                       :multiple="false" @on-change="checkUser2($event,index)"></component>
                  </template>
                  <template v-if="!ifedit">
                    <Button v-if="index === 0" class="myButton" style="margin-left: 2%" @click="addPeople()">
                      <Icon type="ios-add" />
                    </Button>
                    <Button v-else class="myButton" style="margin-left: 2%" @click="deletePeople(index)">
                      <Icon type="ios-remove" />
                    </Button>
                  </template>
                </FormItem>
                </Col>
              </Row>
              <Row>
                <Col span="8">
                <FormItem label="使用人联系电话：" prop="phone">
                  <Input v-model="applyinfo.people[index].phone" :readonly="ifedit" />
                </FormItem>
                </Col>
                <Col span="8" class="col_left">
                <FormItem label="借用单位：" prop="outterCompany">
                  <Input v-if="item.editDept" v-model="applyinfo.people[index].outterCompany" :readonly="ifedit" />
                  <template v-else>
                    <Input v-if="ifedit" v-model="applyinfo.people[index].outterCompany" :readonly="true" />
                    <Select v-else v-model="applyinfo.people[index].outterCompany" :disabled="ifedit">
                      <Option v-for="item in applyinfo.people[index].deptList" :value="item.gName" :key="item.gName">
                        {{item.gName}}</Option>
                    </Select>
                  </template>
                </FormItem>
                </Col>
              </Row>
            </template>
          </Form>
        </div>
      </template>
      <template id="accountInfo">
        <div class="qheader"
          :style="{borderBottom: ifedit ? '0px solid rgb(210,210,210)' : '1px solid rgb(210,210,210)',}">
          <p>账号信息</p>
        </div>
        <div class="gcontent">
          <Form :id="accountId" ref="accountInfo" :rules="accountInfoValidate" :model="applyinfo"
            :label-width="labelWidth" label-position="left" class="form form_left">
            <Row>
              <Col span="8">
              <FormItem label="借用时间：" prop="startTime">
                <DatePicker type="datetime" format="yyyy-MM-dd HH:mm" :options="disabledDate"
                  v-model="applyinfo.startTime" style="width: 100%;" :disabled="ifedit" placeholder="请选择日期">
                </DatePicker>
              </FormItem>
              </Col>
              <Col span="8" class="col_left">
              <FormItem prop="deadline">
                <template slot="label">
                  <span>归还时间</span>
                  <Tooltip content="工程建设期借用时间不超过5天; 已上线期间借用时间不超过4个小时" max-width="200" placement="right" :transfer="true"
                    style="white-space: normal;">
                    <Icon type="md-help-circle" />
                  </Tooltip>
                  <span>:</span>
                </template>
                <DatePicker type="datetime" format="yyyy-MM-dd HH:mm" :options="disabledDate"
                  v-model="applyinfo.people[0].deadline" style="width: 100%;" :disabled="ifedit" placeholder="请选择日期">
                </DatePicker>
              </FormItem>
              </Col>
            </Row>

            <Row>
              <Col span="8">
              <FormItem label="账号类型：" prop="accountAttr">
                <Input v-if="ifedit" v-model="applyinfo.people[0].severs[0].accountAttr" :readonly="readonly" />
                <Select v-else v-model="applyinfo.people[0].severs[0].accountAttr" :transfer='true' style="z-index:999"
                  :disabled="ifedit">
                  <Option value="主机账号">主机账号</Option>
                  <Option value="数据库账号">数据库账号</Option>
                  <Option value="中间件">中间件</Option>
                </Select>
              </FormItem>
              </Col>
              <Col span="8" class="col_left">
              <FormItem label="账号名：" prop="sname">
                <!-- 								<template slot="label">
									<span>账号名</span>
									<Tooltip content="赋予sudo权限的账号,多个账号请以英文逗号分隔" max-width="200" placement="right" :transfer="true" style="white-space: normal;">
										<Icon type="md-help-circle" />
									</Tooltip>
									<span>:</span>
								</template> -->
								<Tooltip content="赋予sudo权限的账号,多个账号请以英文逗号分隔" max-width="220" placement="top-start" :transfer="true" style="white-space: normal;width:100%">
									<Input v-model="applyinfo.people[0].severs[0].sname" :readonly="ifedit" type="textarea" :rows="1"/>
								</Tooltip>
							</FormItem>
							</Col>
						</Row>
						<Row>
							<Col span="8">
							<FormItem label="所属系统：" prop="sysId">
								<Input v-if="ifedit" v-model="applyinfo.people[0].severs[0].rxPath" :readonly="readonly" />
								<Select v-else :label-in-value="true" v-model="applyinfo.sysId" filterable @on-change="checksys" :disabled="ifedit">
									<Option v-for="item in sysList" :value="item.id" :key="item.id">{{item.sysName}}</Option>
								</Select>
							</FormItem>
							</Col>
							<Col span="8" class="col_left">
							<FormItem label="地址(段)：" prop="wpath">
<!-- 								<template slot="label">
									<span>地址(段)</span>
									<Tooltip content="申请多个IP请以英文逗号分隔" max-width="200" placement="right" :transfer="true" style="white-space: normal;">
										<Icon type="md-help-circle" />
									</Tooltip>
									<span>:</span>
								</template> -->
                <Tooltip content="申请多个IP请以英文逗号分隔" max-width="220" placement="top-start" :transfer="true"
                  style="white-space: normal;width:100%">
                  <Input v-model="applyinfo.people[0].severs[0].wpath" :readonly="ifedit"
                    @on-blur="checkIP(applyinfo.people[0].severs[0].wpath)" type="textarea" :rows="1" />
                </Tooltip>
              </FormItem>
              </Col>
            </Row>
            <Row>
              <Col span="22" style="width:96.666667%">
              <FormItem label="操作指令：" prop="reqDes">
                <Input v-model="applyinfo.reqDes" type="textarea"
                  placeholder="申请sudo免密的指令，精确操作指令，示例：pip install,tar,cd, ..." :rows="3" :readonly="ifedit" />
              </FormItem>
              </Col>
            </Row>
            <Row>
              <Col span="22" style="width:96.666667%">
              <FormItem label="申请原因：" prop="purpose">
                <Input v-model="applyinfo.purpose" type="textarea" :rows="3" :readonly="ifedit" />
              </FormItem>
              </Col>
            </Row>
          </Form>
        </div>
      </template>
      <template>
        <div class="qheader"
          :style="{borderBottom: ishidden ? '0px solid rgb(210,210,210)' : '1px solid rgb(210,210,210)',}">
          <p>附件</p>
        </div>
        <component ref="file" :is="'file'" :ifedit="ifedit" :filesList="filesList" v-model="applyinfo.files">
        </component>
      </template>
    </div>
  </div>
</template>

<script>
  import ajax from "../../ajax_util"
  import Axios from 'axios'
  import file from './settledin/file'
  import inputSearch from '../../base/input_search'
  import PDFJs from '../../plugins/PDFJs.js'
  import printModel from './print/print_model'

  export default {
    name: "sys",
    components: {
      file,
      inputSearch,
      printModel
    },

    data() {
      const validatepeopleName = (rule, value, callback) => {
        this.applyinfo.people.forEach(item => {
          if (item.peopleName == '' || item.peopleName == null || item.peopleName == undefined) {
            callback(new Error('请选择使用人'));
          } else {
            callback()
          }
        })
      };
      const validateoutterCompany = (rule, value, callback) => {
        this.applyinfo.people.forEach(item => {
          if (item.outterCompany == '' || item.outterCompany == null || item.outterCompany == undefined) {
            callback(new Error('请填写借用单位'));
          } else {
            callback()
          }
        })
      };
      const validateduty = (rule, value, callback) => {
        if (this.applyinfo.people[0].duty == '') {
          callback(new Error('请填写工单标题'));
        } else {
          if (this.applyinfo.people[0].duty.length > 50) {
            callback(new Error('最多填写50个字符'));
          } else {
            callback()
          }
        }
      };
      const validatedeadline = (rule, value, callback) => {
        if (this.applyinfo.people[0].deadline == '') {
          callback(new Error('请选择归还时间'));
        } else {
          if (this.applyinfo.startTime === '') {
            callback(new Error('请选择借用时间'));
          } else if (this.applyinfo.startTime.getTime() > this.applyinfo.people[0].deadline.getTime()) {
            callback(new Error('归还时间不能小于借用时间'));
          } else if (this.applyinfo.people[0].elseAuthes[0].des == '工程建设期' && (this.applyinfo.people[0].deadline
              .getTime() -
              this.applyinfo.startTime.getTime() > 432000000)) {
            console.log(this.applyinfo.people[0].deadline.getTime(), this.applyinfo.startTime.getTime())
            callback(new Error('【工程建设期】借用时间不能超过5天'));
          } else if (this.applyinfo.people[0].elseAuthes[0].des == '已上线' && (this.applyinfo.people[0].deadline
              .getTime() -
              this.applyinfo.startTime.getTime() > 14400000)) {
            callback(new Error('【已上线期间】借用时间不能超过4个小时'));
          }
          // else if (this.applyinfo.people[0].elseAuthes[0].des == '系统升级、变更' && (this.applyinfo.people[0].deadline.getTime() -
          // 		this.applyinfo.startTime.getTime() > 259200000)) {
          // 	callback(new Error('【系统升级、变更期间】借用时间不能超过3天'));
          // }
          else {
            callback()
          }
        }
      };
      const validateaccountAttr = (rule, value, callback) => {
        if (this.applyinfo.people[0].severs[0].accountAttr == '') {
          callback(new Error('请选择账号类型'));
        } else {
          callback()
        }
      };
      const validatesname = (rule, value, callback) => {
        if (this.applyinfo.people[0].severs[0].sname == '') {
          callback(new Error('请输入主机账号名'));
        } else {
          callback()
        }
      };
      const validatesysId = (rule, value, callback) => {
        if (this.applyinfo.sysId == '') {
          callback(new Error('请选择所属系统'));
        } else {
          callback()
        }
      };
      const validatewpath = (rule, value, callback) => {
        if (this.applyinfo.people[0].severs[0].wpath == '') {
          callback(new Error('请输入地址(段)'));
        } else {
          callback()
        }
      };
      const validateroleId = (rule, value, callback) => {
        if (this.applyinfo.roleId == '' || this.applyinfo.roleId == undefined || this.applyinfo.roleId == 0) {
          callback(new Error('请选择所属租户'));
        } else {
          callback()
        }
      };
      const validateprojectId = (rule, value, callback) => {
        if (this.applyinfo.projectId == undefined || this.applyinfo.projectId == '' || this.applyinfo.projectId ==
          0) {
          callback(new Error('请选择所属项目'));
        } else {
          callback()
        }
      };
      const validateDes = (rule, value, callback) => {
        if (this.applyinfo.people[0].elseAuthes[0].des == undefined || this.applyinfo.people[0].elseAuthes[0].des ==
          '') {
          callback(new Error('请选择项目进度'));
        } else {
          callback()
        }
      };
      const validatePhone = (rule, value, callback) => {
        let reg = this.validateUtils.telephoneRule;
        if (this.applyinfo.people[0].phone == undefined || this.applyinfo.people[0].phone == '' || !reg.test(this
            .applyinfo
            .people[0].phone)) {
          callback(new Error('请填写正确的联系电话'));
        } else {
          callback()
        }
      };
      const validateUserInfo = (rule, value, callback) => {
        this.applyinfo.people.forEach(item => {
          if (item.peopleName == undefined || item.peopleName == null || item.peopleName == "") {
            callback(new Error('请选择使用人'));
          }
        })

        callback()
      };
      const validateCompany = (rule, value, callback) => {
        this.applyinfo.people.forEach(item => {
          if (item.outterCompany == undefined || item.outterCompany == null || item.outterCompany == "") {
            callback(new Error('请填写借用单位'));
          }
        })

        callback()
      };
      const validateUserPhone = (rule, value, callback) => {
        this.applyinfo.people.forEach(item => {
          if (item.phone == undefined || item.phone == null || item.phone == "") {
            callback(new Error('请填写使用人联系电话'));
          }
        })

        callback()
      };
      return {
        baseInfoValidate: {
          duty: [{
            required: true,
            validator: validateduty,
            trigger: 'change'
          }],
          outterCompany: [{
            required: true,
            validator: validateoutterCompany,
            trigger: 'change'
          }],
          peopleName: [{
            required: true,
            validator: validatepeopleName,
            trigger: 'change'
          }],
          roleId: [{
            required: true,
            validator: validateroleId,
            trigger: 'change'
          }],
          projectId: [{
            required: true,
            validator: validateprojectId,
            trigger: 'change'
          }],
          des: [{
            required: true,
            validator: validateDes,
            trigger: 'change'
          }],
          Phone: [{
            required: true,
            validator: validatePhone,
            trigger: 'change'
          }]
        },
        userInfoValidate: {
          userInfo: [{
            required: true,
            validator: validateUserInfo,
            trigger: 'change'
          }],
          outterCompany: [{
            required: true,
            validator: validateCompany,
            trigger: 'change'
          }],
          phone: [{
            required: true,
            validator: validateUserPhone,
            trigger: 'change'
          }]
        },
        accountInfoValidate: {
          startTime: [{
            required: true,
            type: 'date',
            message: '请选择借用时间',
            trigger: 'change'
          }],
          deadline: [{
            required: true,
            validator: validatedeadline,
            trigger: 'change'
          }],
          accountAttr: [{
            required: true,
            validator: validateaccountAttr,
            trigger: 'change'
          }],
          sname: [{
            required: true,
            validator: validatesname,
            trigger: 'change'
          }],
          sysId: [{
            required: true,
            validator: validatesysId,
            trigger: 'change'
          }],
          wpath: [{
            required: true,
            validator: validatewpath,
            trigger: 'change'
          }],
          purpose: [{
            required: true,
            type: 'string',
            message: '请填写申请原因',
            trigger: 'change'
          }],
          reqDes: [{
            required: true,
            type: 'string',
            message: '请填写操作指令',
            trigger: 'change'
          }]
        },
        stepPage: "baseInfo",
        labelWidth: 140,
        readonly: true, //是否只读
        disabledDate: {
          disabledDate(date) {
            return date && date.valueOf() < Date.now() - 24 * 60 * 60 * 1000;
          }
        },
        // ifedit: this.isedit,
        applyinfo: {
          startTime: new Date(),
          phone: "",
          apartment: "",
          userPhone: "",
          roleId: "",
          projectId: "",
          accountAttr: "",
          serverName: "",
          place: "",
          reqDes: "",
          purpose: "",
          os: "",
          sysId: "",
          people: [{
            deptList: [],
            peopleName: '',
            peopleUserId: "",
            phone: "",
            tenantName: "",
            igroup: "",
            exAccount: "",
            fourA: "",
            mail: "",
            department: "",
            outterCompany: "",
            duty: "",
            deadline: "",
            getUserInfo: "",

            severs: [{
              accountAttr: "",
              sname: "",
              wpath: "",
              rxPath: "",
              deadline: "",


            }],
            elseAuthes: [{
              des: "",
            }]
          }],
          files: [],
        },
        deptList: [],
        roleList: [],
        userList: [],
        projectList: [],
        sysList: [],
        editDept: false, //手动填写申请组织部门，电话

        printBaseInfo: [],
        baseInfoLength: 0,
        printAccount: [],
        accountLength: 0,
        printUserInfo: [],
        userInfoLength: 0,
        baseId: this.reqId + "base",
        userInfoId: this.reqId + "user",
        accountId: this.reqId + "account",
        myhtml: {},
        serviceType: "hightAuthoritys"
      }
    },

    created: function() {

    },

    mounted: function() {
      console.log("this.reqId,this.draftsId---------->", this.reqId, this.draftsId)

      this.$nextTick(() => {
        if (this.reqId == null && this.draftsId == null) {
          this.get_all_sys()
          this.getUserInfo()
        } else if (this.reqId != null) {
          console.log("获取表单详情---------->");
          this.getApplyInfo(); //获取表单详情
        } else if (this.draftsId != null) {
          console.log("获取草稿---------->")
          this.get_all_sys()
          this.getDrafts();
        }
      })
    },

    methods: {
      print() {
        var printInfo = []
        printInfo.push({
          title: "基本信息",
          type: "dafault",
          info: {
            printObject: this.printBaseInfo,
            printLength: this.baseInfoLength
          }
        })
        printInfo.push({
          title: "使用人信息",
          type: "dafault",
          info: {
            printObject: this.printUserInfo,
            printLength: this.userInfoLength
          }
        })
        printInfo.push({
          title: "账号信息",
          type: "dafault",
          info: {
            printObject: this.printAccount,
            printLength: this.accountLength
          }
        })
        // var printInfo = {
        //   printBaseInfo: this.printBaseInfo,
        //   baseInfoLength: this.baseInfoLength,
        //   printAccount: this.printAccount,
        //   accountLength: this.accountLength
        // }

        const {
          href
        } = this.$router.resolve({
          path: '/other_page/print',
          query: {
            serviceType: this.serviceType,
            printName: "最高权限表单",
            printId: this.reqId
          }
        })
        sessionStorage[this.reqId] = JSON.stringify(printInfo)
        window.open(href, '_blank')
        this.newValue = false
      },
      get_all_sys() {
        var that = this;
        var url = that.CONFIG.progress_url + "/system-map/for/superAcc";
        ajax.get({
          url: url,
          that: that,
          success: function(data) {
            console.log('get_all_sys:', data)
            that.sysList = data
          }
        })
      },
      checkUser2(list, index) {
        console.log('list', list)
        if (list != undefined && list.length > 0) {
          this.applyinfo.people[index].editDept = false
          // this.applyinfo.roleId = ""
          // this.applyinfo.projectId = ""
          this.applyinfo.people[index].outterCompany = ""
          this.applyinfo.people[index].peopleUserId = list[0].id
          this.applyinfo.people[index].peopleName = list[0].user_name
          this.applyinfo.people[index].phone = list[0].phone
          //this.roleList = list[0].roles
          this.applyinfo.people[index].deptList = list[0].structs
          var userid = ""
          if (typeof list[0].id == 'number') {
            userid = list[0].id
          } else {
            this.applyinfo.people[index].editDept = true
          }
          //this.checkUser(userid);
        }
      },
      addPeople() {
        this.applyinfo.people.push({
          deptList: [],
          peopleName: '',
          peopleUserId: "",
          phone: "",
          tenantName: "",
          igroup: "",
          exAccount: "",
          fourA: "",
          mail: "",
          department: "",
          outterCompany: "",
          duty: "",
          deadline: "",
          getUserInfo: "",

          severs: [{
            accountAttr: "",
            sname: "",
            wpath: "",
            rxPath: "",
            deadline: "",


          }],
          elseAuthes: [{
            des: "",
          }]
        })
      },
      deletePeople(index) {
        console.log("===index==", index, this.applyinfo.people);
        this.userList.splice(index, 1);
        this.applyinfo.people.splice(index, 1);
      },
      getUserInfo() {
        console.log('this.$store.state.user', this.$store.state.user)
        var temp = this.$store.state.user
        this.applyinfo.people[0].exAccount = temp.user_name
        this.applyinfo.people[0].fourA = temp.phone
        this.applyinfo.people[0].getUserInfo = temp.id
        this.applyinfo.people[0].mail = temp.email
        this.applyinfo.people[0].department = temp.department
        this.checkUser(temp.id)
        //this.applyinfo.userId = temp.id
      },

      checkUser(userId) {
        var params = {
          applyId: this.applyinfo.people[0].getUserInfo,
          userId: userId
        }
        //console.log("!!!!!!!!");
        var that = this;
        var url = this.CONFIG.url_know + '/getUnionRoles';
        ajax.post({
          that: that,
          url: url,
          data: params,
          success: function(data) {
            console.log("roleList----->", data)
            that.roleList = data

            if (that.applyinfo.roleId != null && that.applyinfo.roleId != undefined && that.applyinfo.roleId !=
              "") {
              that.checkRole(that.applyinfo.roleId)
            }
          }
        })
      },
      //获取使用人信息
      getPeopleUserInfo(userId, index) {
        if (userId != undefined && userId != '' && typeof userId == 'number' && userId != 0) {
          var that = this;
          var url = this.CONFIG.url_know + '/user/' + userId;
          ajax.get({
            url: url,
            that: that,
            success: function(data) {
              console.log("user----->", data)
              // that.roleList = data.roles
              that.applyinfo.people[index].deptList = data.structs
              that.checkUser(userId)
            }
          })
        } else {
          this.applyinfo.people[index].editDept = true
          this.checkUser("")
        }
      },

      checkRole(roleId) {
        if (roleId != undefined && roleId != '') {
          this.roleList.some(item => {
            console.log("========item======", item);
            if (roleId == item.id) {
              this.projectList = item.projects;
              return true
            }
          })
          // var url = this.CONFIG.url_know + "/getProjects/" + roleId
          // var that = this;
          // ajax.get({
          //   url: url,
          //   that: that,
          //   params: null,
          //   success: function(data) {
          //     console.log('checkRole', data)
          //     that.projectList = data
          //     if (data == []) {
          //       that.applyinfo.people[0].igroup = ""
          //     }
          //   }
          // })
        }
      },

      checkProject(project) {
        console.log("project------->", project)
        if (this.projectList.length > 0) {
          var temp = this.projectList.find(e => e.id == project)
          if (temp != undefined) {
            this.applyinfo.people[0].igroup = this.projectList.find(e => e.id == project).project
          }
        }
      },

      checksys(sys) {
        console.log('checksys', sys)
        this.applyinfo.people[0].severs[0].rxPath = sys.label
      },

      getApplyInfo() {
        var data = this.processInfo
        console.log("----this.processInfo---", this.processInfo);
        this.applyinfo = data.content
        if (data.files != undefined && data.files != null) {
          this.applyinfo.files = data.files
        }

        if (this.ifedit) {
          this.applyinfo.people[0].deadline = this.formatDate(data.content.people[0].deadline)
          this.applyinfo.startTime = this.formatDate(data.content.startTime)
        }
        // this.checkUser(this.applyinfo.people[0].peopleUserId)
        this.setUserInfo(data.content.userId)

        this.userList = [];
        this.applyinfo.people.forEach(item => {
          var j = {};
          if (item.peopleUserId == 0) {
            j.id = item.peopleName;
            item.peopleUserId = item.peopleName;
          } else {
            j.id = item.peopleUserId;
          }
          j.user_name = item.peopleName;
          this.userList.push(j);
        })

        this.applyinfo.people[0].tenantName = this.processInfo.content.rspInfo.oriRole.tenant_name
        this.$set(this.applyinfo.people[0], "getUserInfo", data.content.userId)
        if (this.isEdit == 1) {
          this.get_all_sys()
          // this.getPeopleUserInfo(this.applyinfo.people[0].peopleUserId)
          for (var i = 0; i < this.applyinfo.people.length; i++) {
            // if(this.applyinfo.people[i].peopleUserId > 0){
            this.getPeopleUserInfo(this.applyinfo.people[i].peopleUserId, i)
            // }
          }
        }

        console.log("----this.processInfowww---", this.applyinfo, this.userList);
      },

      getDrafts() {
        var url = this.CONFIG.base_url_test + "/draft/content/" + this.draftsId
        var that = this;

        ajax.get({
          url: url,
          that: that,
          params: null,
          success: function(data) {
            console.log('drafts-', data.req)
            that.applyinfo = data.req.object
            that.applyinfo.startTime = that.formatDate(data.req.object.startTime)
            if (data.req.object.people[0].deadline != null && data.req.object.people[0].deadline != 0) {
              that.applyinfo.people[0].deadline = that.formatDate(data.req.object.people[0].deadline)
            } else {
              that.applyinfo.people[0].deadline = ""
            }
            // that.getPeopleUserInfo(data.req.object.people[0].peopleUserId)
            //that.checkRole(data.req.object.roleId)
            that.getUserInfo()
            that.userList = [];
            for (var i = 0; i < data.req.object.people.length; i++) {
              var j = {};
              j.id = data.req.object.people[i].peopleUserId;
              j.user_name = data.req.object.people[i].peopleName;
              that.userList.push(j);

              that.getPeopleUserInfo(data.req.object.people[i].peopleUserId, i)
            }
          }
        })
      },
      setUserInfo(userId) {
        var that = this;
        var url = this.CONFIG.url_know + '/user/' + userId;
        ajax.get({
          url: url,
          that: that,
          success: function(data) {
            console.log("data------》", data)
            that.applyinfo.people[0].exAccount = data.user_name
            that.applyinfo.people[0].fourA = data.phone
            that.$set(that.applyinfo.people[0], "department", that.processInfo.dptName)
            that.$set(that.applyinfo.people[0], "mail", data.email)
            that.$set(that.applyinfo.people[0], "getUserInfo", data.id)
          }
        })
      },
      getInfo() {

        var t = JSON.stringify(this.applyinfo)
        var temp1 = JSON.parse(t)
        var temp = {
          base: {
            dptName: this.applyinfo.people[0].department,
            projectId: this.applyinfo.projectId
          }
        }

        console.log('temp1', temp1)
        temp1.userId = this.applyinfo.people[0].getUserInfo
        temp.object = temp1
        temp.object.people[0].deadline = parseInt(new Date(temp1.people[0].deadline).getTime() / 1000)
        temp.object.startTime = parseInt(new Date(temp1.startTime).getTime() / 1000)

        temp.object.people.forEach(item => {
          if (typeof item.peopleUserId != 'number') {
            item.peopleUserId = 0
          }
        })

        var publicInfo = this.utils.setPublicInfoInfo(this.applyinfo.people[0].duty, temp.object.startTime, temp.object
          .people[0].deadline, this.applyinfo.purpose)
        //temp.files = this.$refs.file.getFiles()
        temp.files = temp1.files
        temp.puslicInfo = publicInfo

        for (var i = 1; i < temp.object.people.length; i++) {
          temp.object.people[i].igroup = temp.object.people[0].igroup;
          temp.object.people[i].exAccount = temp.object.people[0].exAccount;
          temp.object.people[i].fourA = temp.object.people[0].fourA;
          temp.object.people[i].mail = temp.object.people[0].mail;
          temp.object.people[i].department = temp.object.people[0].department;
          temp.object.people[i].duty = temp.object.people[0].duty;
          temp.object.people[i].deadline = temp.object.people[0].deadline;
          temp.object.people[i].getUserInfo = temp.object.people[0].getUserInfo;
          temp.object.people[i].severs = temp.object.people[0].severs;
          temp.object.people[i].elseAuthes = temp.object.people[0].elseAuthes;
        }

        console.log('temp', temp)
        return temp
      },

      formatDate(value) {
        var date = new Date(value * 1000);
        console.log("value---->", value)
        return this.utils.formatDate(date, 'yyyy-MM-dd hh:mm');
      },
      formatTime(value) {
        var date = new Date(value);
        var year = date.getFullYear();
        var month = this.padDate(date.getMonth() + 1);
        var day = this.padDate(date.getDate());
        var hour = this.padDate(date.getHours());
        return year + '-' + month + '-' + day + '-' + hour;
      },
      padDate(value) {
        return value < 10 ? '0' + value : value;
      },

      validate() {
        var isSubmit = false
        this.$refs["baseInfo1"].validate((valid) => {
          if (valid) {
            isSubmit = true
          } else {
            isSubmit = false
            this.$Message.error('请填写基本信息必填项');
          }
        })

        if (isSubmit) {
          this.$refs["userInfo"].validate((valid) => {
            if (valid) {
              isSubmit = true
            } else {
              isSubmit = false
              //this.$Message.error('请填写使用人信息必填项');
            }
          })
        }

        if (isSubmit) {
          this.$refs["accountInfo"].validate((valid) => {
            if (valid) {
              isSubmit = true
            } else {
              isSubmit = false
              this.$Message.error('请填写账号信息必填项');
            }
          })
        }

        if (isSubmit) {
          var bool = this.checkIP(this.applyinfo.people[0].severs[0].wpath);
          if (bool) {
            isSubmit = true;
          } else {
            isSubmit = false;
            //this.$Message.error('输入IP格式有误，请重新输入！')
          }
        }
        console.log(isSubmit)
        return isSubmit
      },

      // 获取处理时需要提交的参数
      getHandleParams(handleInfo) {
        handleInfo.reqSubject = this.applyinfo.people[0].duty
        handleInfo.startTime = parseInt(new Date(this.applyinfo.startTime).getTime() / 1000)
        handleInfo.hopeTime = parseInt(new Date(this.applyinfo.people[0].deadline).getTime() / 1000)
        handleInfo.reqDes = this.applyinfo.purpose
        handleInfo.isEdit = this.isEdit;
        console.log("aaaa-------->", this.ifedit, this.isEdit == 1)
        handleInfo.isChangeContent = 0;
        if (!this.ifedit) {
          handleInfo.isChangeContent = 1;
        }
        if (this.isEdit == 1) {
          handleInfo.roleId = this.applyinfo.roleId;
          handleInfo.projectId = this.applyinfo.projectId;
          handleInfo.content = this.getInfo()
        }
      },
      //处理页面获取下一步处理人需要的参数
      getHandleUserParams(opOptions) {
        var param = {}
        param.vari = opOptions
        param.roleId = this.applyinfo.roleId;
        param.projectId = this.applyinfo.projectId;
        param.sysId = this.applyinfo.sysId;
        return param
      },
      checkIP(data) {
        console.log("====data====", data);
        let ipRegex =
          /^(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])$/

        var ipList = data.split(',');
        for (var i = 0; i < ipList.length; i++) {
          if (ipRegex.test(ipList[i]) === false) {
            console.log("66666666")
            this.$Message.error('输入IP格式有误，请重新输入！')
            return false;
          }
        }
        return true;
      },
    },

    props: {
      isEdit: {},
      value: {
        dafault: false
      },
      ifedit: {
        type: Boolean,
        default: false,
      },
      reqId: {
        default: null
      },
      draftsId: {
        default: null
      },
      filesList: {},
      processInfo: {},
      ishidden: {
        type: Boolean,
        default: false,
      },
    },
    // computed:{
    //     isEdit(){
    //         return this.$store.state.tabs != undefined && this.$store.state.tabs!=null? this.$store.state.tabs.isEdit:""
    //     }
    // },
    watch: {
      newValue(val) {
        if (val) {
          var base = this.myElement.getElement(this.baseId);
          console.log("=====get打印111=====", base);
          this.printBaseInfo = base.object;
          this.baseInfoLength = base.length;

          var userInfo = this.myElement.getElement(this.userInfoId);
          console.log("=====get打印111=====", base);
          this.printUserInfo = userInfo.object;
          this.userInfoLength = userInfo.length;

          var account = this.myElement.getElement(this.accountId);
          console.log("=====get打印111=====", account);
          this.printAccount = account.object;
          this.accountLength = account.length;

          this.print()
        }
      }
    },
    computed: {
      newValue: {
        get: function() {
          return this.value;
        },
        set: function(value) {
          this.$emit('input', value);
        }
      },
    }
  }
</script>
